<template>
    <div>
        <!--新增按钮位置-->
        <div style="position:fixed;z-index:100;width:100%">
            <div role="button" tabindex="0"
                class="van-cell van-cell--clickable van-cell--center van-cell--borderless van-contact-card van-contact-card--add"
                style="position:fixed;width:70%;">
                <van-field name="calendar" :value="createTime" label="日报日期" placeholder="点击选择日期"
                    @click="showCalendar = true" />
                <van-calendar :minDate="minDate" v-model="showCalendar" @confirm="onConfirm" />
            </div>
            <div style="position:fixed;width:30%;left:70%;padding: 2px;" class="van-cell--borderless van-contact-card">
                <van-dropdown-menu title="班级选择">
                    <van-dropdown-item v-model="classId" :options="classInfos" @change="changeClass" />
                </van-dropdown-menu>
            </div>
        </div>
        <div>
            <div style="height: 80px"></div>

            <van-cell-group inset v-for="(item, index) in dailys">
                <van-cell @click="backproblem(item)" :title="item.content" :label="item.problem" is-link value="回复" />
            </van-cell-group>

            <div style="height: 80px"></div>
        </div>

        <van-dialog v-model="showcomment" title="回复模块" show-cancel-button :beforeClose="beforeClose">
            <van-cell-group>
                <van-field v-model="comment" label="回复内容" placeholder="" />
            </van-cell-group>
        </van-dialog>
    </div>
</template>
<style>
.van-dropdown-menu__bar {
    height: 72px;
}
</style>
<script>
import req from '../../request/index'
export default {
    name: '',
    data() {
        return {
            minDate: new Date(2020, 0, 1),
            createTime: '',
            showCalendar: false,
            classInfos: [],
            classId: '',
            className: '',
            dailys: [],
            comment:'',
            showcomment:false,
            item:''
        };
    },
    methods: {
        beforeClose(val, next) {
            if (val == "confirm") {
                req({
                    url: "updateDailyComment",
                    method: "post",
                    data: {
                        id: this.item.id,
                        comment: this.comment
                    }
                }).then(res => {
                    console.log(res);
                    this.getDailys()
                }).catch(err => {
                    console.log(err);
                })
            }
            next();
        },
        backproblem(item) {
            console.log(item)
            this.showcomment = true;
            this.comment = item.comment;
            this.item = item;
        },
        onConfirm(date) {
            this.createTime = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate() > 9 ? date.getDate() : "0" + date.getDate()}`;
            this.showCalendar = false;
            this.getDailys()
        },
        changeClass(res) {
            //根据班级id获取当前的所有任务信息
            for (var i = 0; i < this.classInfos.length; i++) {
                if (this.classInfos[i].value == res) {
                    this.className = this.classInfos[i].text;
                    this.getDailys()
                }
            }
        },
        getDailys() {
            req({
                url: "getDailys",
                method: "post",
                data: {
                    createTime: this.createTime,
                    relationClassId: this.classId
                }
            }).then(res => {
                console.log(res.data.data)
                this.dailys = res.data.data
            }).catch(err => {
                console.log(err);
            })
        },
        getClassInfo() {
            req({
                url: "getClassInfo",
                method: "post",
                data: {
                    id: this.$store.state.user.id
                }
            }).then(res => {
                if (res.data.code == 0) {
                    var data = res.data.data;
                    this.classId = res.data.data[0].id;
                    this.className = res.data.data[0].name;
                    for (var i = 0; i < data.length; i++) {
                        var x = { text: '班级1', value: 0 };
                        x.text = data[i].name;
                        x.value = data[i].id;
                        this.classInfos.push(x);
                    }
                    //根据班级id获取当前的所有任务信息
                    this.getDailys()
                }
            }).catch(err => {
                console.log(err);
            })
        },
    },
    computed: {
    },
    mounted() {
        var now = new Date();
        this.createTime = `${now.getFullYear()}-${now.getMonth() + 1}-${now.getDate() > 9 ? now.getDate() : "0" + now.getDate()}`;
        this.getClassInfo()
    },
}
</script>